<template>
    <div class="container">
        <div class="body_wrap">
            <el-card shadow="hover" ref="content_card">
                <!-- 基本搜索+功能按钮 -->
                <el-form ref="searchForm1" :inline="true" :model="searchForm" size="medium" label-width="">
                    <el-card class="table_tool_bar_wrap" shadow="never">
                        <div class="base_wrap">
                            <div class="left">
                                <el-form-item label="关键字搜索" prop="keyword">
                                    <el-input placeholder="关键字搜索" v-model="searchForm.keyword" clearable style="width: 180px"/>
                                </el-form-item>

                                <el-button @click="handleSearch" type="primary" size="medium">搜索</el-button>
                                <el-button @click="handleReset" type="info" plain size="medium">重置</el-button>
                                <el-button type="text" size="medium" @click="searchFlag = !searchFlag">
                                    高级搜索<i class="el-icon--right" :class="searchFlag?'el-icon-arrow-down':'el-icon-arrow-up'"></i>
                                </el-button>

                            </div>

                            <div class="right">
                                <el-button v-if="isAuth('system:user:add')" @click="handleAddOrUpdateVisible()" type="primary" size="medium" icon="el-icon-plus">新增</el-button>
                                <el-button v-if="isAuth('system:user:delete')" @click="handleDelete()" type="danger" size="medium" icon="el-icon-delete" :disabled="selectionRows.length == 0" >删除</el-button>
                                <el-dropdown class="ml10" @command="handleCommand">
                                    <el-button type="primary" size="medium">
                                        更多操作<i class="el-icon-arrow-down el-icon--right"></i>
                                    </el-button>
                                    <el-dropdown-menu slot="dropdown">
                                        <el-dropdown-item command="broadcast-message">广播消息</el-dropdown-item>
                                        <el-dropdown-item command="reset-password">重置密码</el-dropdown-item>
                                        <el-dropdown-item command="export-data">导出信息</el-dropdown-item>
                                    </el-dropdown-menu>
                                </el-dropdown>
                            </div>
                        </div>
                    </el-card>
                </el-form>

                <!-- 高级搜索 -->
                <el-form ref="searchForm2" :inline="true" :model="searchForm" size="medium" label-width="120px">
                    <el-collapse-transition>
                        <el-card class="where_wrap" shadow="never" v-if="!searchFlag">
                            <el-row>
                                <el-col :span="8">
                                    <el-form-item label="用户消息" prop="type">
                                        <el-input placeholder="" v-model="searchForm.type" clearable/>
                                    </el-form-item>
                                </el-col>
                                <el-col :span="8">
                                    <el-form-item label="消息状态" prop="status">
                                        <el-input placeholder="" v-model="searchForm.status" clearable/>
                                    </el-form-item>
                                </el-col>
                                <el-col :span="8">
                                    <el-form-item label="消息标题" prop="title">
                                        <el-input placeholder="" v-model="searchForm.title" clearable/>
                                    </el-form-item>
                                </el-col>
                            </el-row>
                        </el-card>
                    </el-collapse-transition>
                </el-form>

                <!-- 表格工具栏 -->
                <div class="table_min_tools">
                    <TableTools
                        :columnList.sync="columnList"
                        @handleCheckAllChange="handleCheckAllChange"
                        @handleFullscreen="handleFullscreen('content_card')"
                        @handleReload="handleReload"
                        @handleStripe="handleStripe"/>
                </div>

                <el-table
                    ref="table"
                    size="medium"
                    empty-text="暂无数据"
                    element-loading-text="给我一点时间"
                    fit border highlight-current-row
                    height="500"
                    v-loading="loading"
                    :data="dataList"
                    :header-cell-style="{'height': '50px'}">
                    <el-table-column prop="person_num" label="编号" width="150">
                    </el-table-column>
                    <el-table-column prop="person_name" label="姓名" width="150">
                    </el-table-column>
                    <el-table-column prop="position_name" label="岗位" width="150">
                    </el-table-column>
                    <el-table-column prop="org_name" label="部门" width="150">
                    </el-table-column>
                    <el-table-column prop="org_name" label="总工作天数" width="150">
                    </el-table-column>
                    <el-table-column prop="org_name" label="乘系数后总天数" width="150">
                    </el-table-column>

                    <el-table-column label="每月稼动率" align="center">
                        <el-table-column :prop="`m${index+1}`" :label="item" v-for="(item, index) in months" :key="index">

                        </el-table-column>
                    </el-table-column>

                    <el-table-column prop="annualJdl" label="年度稼动率" align="center">
                    </el-table-column>

                    <el-table-column prop="date" label="每月标准天数(按华智年历)" align="center">
                        <el-table-column :prop="`bzts${index+1}`" :label="item" v-for="(item, index) in months" :key="index">

                        </el-table-column>
                    </el-table-column>

                    <el-table-column prop="totalBzts" label="总标准工作天数" align="center">
                    </el-table-column>
                </el-table>
            </el-card>
        </div>
    </div>
</template>

<script>
import TableMixin from '@/mixin/TableMixin'
import TableTools from '@/views/components/table/table-tools'
import { mapGetters } from 'vuex'
export default {
    // 稼动率
    name: "Activation",
    mixins: [TableMixin],
    components: {
        TableTools
    },
    computed: {
        ...mapGetters(['user'])
    },

    data() {
        return {
            dataList: [],
            loading: false,
            selectionRows: [],
            searchFlag: true,
            searchForm: {
                keyword: null
            },
            months: ['一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月', '九月', '十月', '十一月', '十二月'],
            dataList: []
        };
    },

    created() {
        this.getDataList();
    },

    methods: {
        async getDataList() {
            this.loading = true
            const res = await this.$http({
                url: 'http://pj.whizen.com/ieasy/admin/oa/jdl2/doNotNeedSession_jdl_center.do',
                method: 'GET',
                params: this.searchForm
            })

            this.dataList = res.rows
            this.dataList.forEach((item, index) => {
                console.log(JSON.stringify(item));
            })
            this.loading = false
        },

        /**
         * 更多操作
         */
        async handleCommand(command) {
            if (command === "") {
            }
        },

        /**
         * 搜索
         */
        handleSearch() {
            this.getDataList()
        },
        /**
         * 重新加载数据表格
         */
        handleReload() {
            this.getDataList()
        },
        /**
         * 重置搜索表单
         */
        handleReset() {
            this.$refs.searchForm1.resetFields()
        }

    }
};
</script>

<style lang="scss" scoped></style>
